// 员工管理系统
let add = document.querySelector(".add");
//form
let control = document.querySelector(".control");
//table
let tab = document.querySelector(".tab");
//
let btn_add = document.querySelectorAll(".sys .control p button")[0];
let btn_cancle = document.querySelectorAll(".sys .control p button")[1];
//删除、修改
// let sp_delete = document.querySelector(".tab tr td span:nth-child(1)");
// let sp_delete = document.querySelectorAll(".sp_delete");
// let sp_modify = document.querySelector(".tab tr td span:nth-child(2)");
// let sp_modify = document.querySelectorAll(".sp_modify");
// console.log(sp_modify);
add.onclick = function (event) {
    control.style.display = "block";
};

btn_cancle.onclick = function (event) {
    control.style.display = "none";
};

// 给所有行的最后两个span添加单击事件
// (function () {
let spans = document.querySelectorAll(".tab span");
// console.log(spans);
    for (let i = 1; i < tab.rows.length; i ++){
        // console.log(tab.rows.length);
        let current_row = tab.rows[i];
        // console.log(current_row);
        let delete_row = spans[(i*2-1)];
        let modify_row = spans[(i*2)];
        // let delete_row = document.querySelector(".tab tr td span:nth-child(1)");
        // let modify_row = document.querySelector(".tab tr td span:nth-child(2)");
        // console.log(i);
        // console.log(delete_row);
        // console.log(modify_row);
        // break;
        delete_row.onclick = function (event) {
            if (current_row.rowIndex != 0) {
                tab.deleteRow(current_row.rowIndex);
            }
        };
        modify_row.onclick = function (event) {
            if (current_row.rowIndex != 0) {
                control.style.display = "block";
                let input = document.querySelectorAll(".control p input");
                let td_length = current_row.rows[0].cells.length;
                //
                for (let j = 0; j < td_length; j ++){
                    //当前单元格
                    let td = current_row.insertCell(j);
                    //判断是否是最后一个单元格
                    if (j == td_length - 1) {
                        td.innerHTML = "<td>\n" +
                            "                <span class=\"sp_delete\">删除</span>\n" +
                            "                <span class=\"sp_modify\">修改</span>\n" +
                            "            </td>";
                        break;
                    }
                    td.innerHTML = input[j].value;
                }
            }else {
                btn_add.onclick = function (event) {
                    let input = document.querySelectorAll(".control p input");
                    //创建单元行，并放入最后一行
                    let tmp_row = tab.insertRow(tab.rows.length);
                    // console.log(tmp_row);
                    //给单元行添加内容
                    let td_length = tab.rows[0].cells.length;
                    for (let j = 0;j < td_length;j ++) {
                        //当前单元格
                        let td = tmp_row.insertCell(j);
                        //在单元格中放入值
                        //判断是否是最后一个单元格
                        if (j == td_length - 1) {
                            td.innerHTML = "<td>\n" +
                                "                <span class=\"sp_delete\">删除</span>\n" +
                                "                <span class=\"sp_modify\">修改</span>\n" +
                                "            </td>";
                            break;
                        }
                        td.innerHTML = input[j].value;
                        console.log(btn_add);
                    }
                };
            }
        };
    }
// })();
// btn_add.onclick = function (event) {
//     let input = document.querySelectorAll(".control p input");
//     //创建单元行，并放入最后一行
//     let tmp_row = tab.insertRow(tab.rows.length);
//     console.log(tmp_row);
//     //给单元行添加内容
//     let td_length = tab.rows[0].cells.length;
//     for (let i = 0;i < td_length;i ++) {
//         //当前单元格
//         let td = tmp_row.insertCell(i);
//         //在单元格中放入值
//         //判断是否是最后一个单元格
//         if (i == td_length - 1) {
//             td.innerHTML = "<td>\n" +
//                 "                <span class=\"sp_delete\">删除</span>\n" +
//                 "                <span class=\"sp_modify\">修改</span>\n" +
//                 "            </td>";
//             break;
//         }
//         td.innerHTML = input[i].value;
//     }
// };